<%--
  Created by IntelliJ IDEA.
  User: yanyi
  Date: 2020/8/15
  Time: 12:46
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    String basePath = request.getScheme() + "://" +
            request.getServerName() + ":" + request.getServerPort() +
            request.getContextPath() + "/";
%>
<html>
<head>
    <title>Title</title>
    <base href="<%=basePath%>">
    <script type="text/javascript" src="js/jquery-3.4.1.js"></script>
    <script type="text/javascript">
        $(function () {
            loadUsers();
            $("#btnLoad").click(
                function () {
                    loadUsers();
                }
            );
        });

        function loadUsers() {
            $.ajax({
                url: "users/queryUser.do?username=" + $("#username").val() + "&addr=" + $("#addr").val(),
                type: "get",
                dataType: "json",
                success: function (data) {
                    $("#info").empty();
                    $.each(data, function (i, n) {
                        $("#info").append("<tr>")
                            .append("<td>" + n.username + "</td>")
                            .append("<td>" + n.addr + "</td>")
                            .append("</tr>")
                    })
                },
                error: function (data) {
                    alert(data);
                }
            });
        }
    </script>
</head>
<body>

<div align="center">
    name<input type="text" id="username">
    addr<input type="text" id="addr">
    <input type="button" value="search" id="btnLoad"/>
    <table>
        <thead>
        <tr>
            <td>name</td>
            <td>addr</td>
        </tr>
        </thead>
        <tbody id="info"></tbody>
    </table>
</div>
</body>
</html>
